<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title><?php echo $seo_title?></title>
    <link rel="shortcut icon" href="/lily.ico" type="image/x-icon" />
    <meta name="keywords" content="{$seo_keywords}" />
    <meta name="description" content="{$seo_desc}" />
    <meta name="title" content="{$seo_title}" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5"/>
    <meta name="applicable-device" content="pc,mobile">
    <?php if((request()->controller()=='News'||request()->controller()=='Events')&&request()->action()=='detail'){?>
    <meta property='og:title' content="{$title}"/>
    <meta property='og:image' content="{$cover}"/>
    <meta property='og:description' content="{$first}"/>
    <meta property='og:url' content="$url"/>
    <meta property="og:image:width" content="1200"/>
    <meta property="og:image:height" content="630"/>
    <meta name="twitter:site" content="@https://www.lily-bearing.com/" />
    <meta name="twitter:creator" content="@lilybearing" />
    <meta name="twitter:title" content="{$title}">
    <meta name="twitter:description" content="{$first}">
    <meta name="twitter:image" content="{$cover}">
    <meta name="twitter:card" content="summary_large_image">
    <?php }?>

    <?php if($base_data['is_no_index']==true){ ?><meta name='robots' content='noindex'><?php }?>
    
    <link rel="canonical" href="<?php echo $base_data['canonical_url']?>" />
    <link rel="stylesheet" href="/static/css/swiper-bundle.min.css" media="all" />
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/static/css/public4.css" media="all" />
    <link rel="stylesheet" href="/static/css/nav2.css" media="all" />
    <link rel="stylesheet" href="/static/css/header.css" media="all" />
    <link rel="stylesheet" href="/static/css/header-es-search.css" media="all" />
    <link rel="stylesheet" href="/static/css/header-sp.css" media="all" />
    <link rel="alternate" href="https://{:Config::get('app.web_host_name')}" hreflang="en" />

    <!-- Google Tag Manager -->
    <script>
        (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-53QZTLM');
    </script>
    <!-- End Google Tag Manager -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-Z0MD8PGCEB"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag() {dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', 'G-Z0MD8PGCEB');
    </script>
    <!-- Global site tag (gtag.js) - Google Ads: 1016956908 -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=AW-1016956908"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', 'AW-1016956908', {'allow_enhanced_conversions': true});
        gtag('config', 'AW-10806041590');
    </script>
    <script>
        var enhanced_conversion_data;
        window.addEventListener('load', function () {
            document.querySelectorAll('button[type*="button"]').forEach(function(e){
                e.addEventListener('click',function(){

                    var name = document.getElementsByName("name")[0].value;
                    var email = document.getElementsByName("email")[0].value;
                    var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

                    if (name != "" && email != "" && email.match(mailformat)) {
                        enhanced_conversion_data = { "email": email }
                        gtag('event', 'conversion', {'send_to': 'AW-1016956908/BKdJCLf-zP4CEOyP9uQD'});
                    };
                });
            });
        });
    </script>
    <script>
        var enhanced_conversion_data;
        window.addEventListener('load', function () {
            document.querySelectorAll('button[type*="button"]').forEach(function(e){
                e.addEventListener('click',function(){

                    var name = document.getElementsByName("name")[0].value;
                    var email = document.getElementsByName("email")[0].value;
                    var code = document.getElementsByName("code")[0].value;
                    var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

                    if (name != "" && email != "" && code != " " && email.match(mailformat)) {
                        enhanced_conversion_data = { "email": email }
                        gtag('event', 'conversion', {'send_to': 'AW-1016956908/BKdJCLf-zP4CEOyP9uQD'});
                    };
                });
            });
        });
    </script>
    <!-- bing -->
    <script>
        (function(w,d,t,r,u)
        {
            var f,n,i;
            w[u]=w[u]||[],f=function()
            {
                var o={ti:" 56063651"};
                o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")
            },
                n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function()
            {
                var s=this.readyState;
                s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)
            },
                i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)
        })
        (window,document,"script","//bat.bing.com/bat.js","uetq");
    </script>

    <script>
        function uet_report_conversion() {
            window.uetq = window.uetq || [];
            window.uetq.push("event", "Chat", {"event_category":"LiveChat"});
        }
    </script>
    <!--end bing-->
    <script type="text/javascript">
        (function(c,l,a,r,i,t,y){
            c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
            t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
            y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
        })(window, document, "clarity", "script", "cfkj4rwxs5");
    </script>
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-53QZTLM" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<!--导航-->
<nav class="main-nav" role="navigation">
    <div class="layui-container nav-body">
        <div class="header-content" style="position:relative;">
            <div class="caidan">
                <input id="main-menu-state" type="checkbox" style="display: none" />
                <label class="main-menu-btn" for="main-menu-state">
                    <span class="main-menu-btn-icon"></span> 菜单
                </label>
            </div>

            <div class="logo logoT header-logo" style="width: 10%;float:left;">
                <a href="/" class="nav-brand"><img src="{:Config::get('app.images_host')}/images/web/logo.png" style="aspect-ratio:4/3; object-fit:contain;" alt="LILY Bearing logo"/></a>
            </div>
            
            <div style="float: right;height: 30px;line-height:30px;" id='order_num_change_img_phone'>
                <a href="/order/" style="padding:0px;margin-top:3px"> <div id='order_num_change_phone' style="color:#ffffff;float:left;margin-top:3px;margin-right: -10px;"><?php echo count(cookie('name'))?count(cookie('name')):0; ?></div><img style="width:45px; aspect-ratio:4/3; object-fit:contain; " src="{:Config::get('app.images_host')}/images/web/gouwu.png" alt="gouwu"></a>
            </div>

            <div class="navigation-header" style="width: 90%;float:left;">
                <div class="navcontent">
                    <style type="text/css">
                        #selinfo{width: 180%}
                        #selinfo .left-ul-sear a{font: 12px/14px arial,helvetica,sans-serif;color:#333;text-decoration: none;}
                        #selinfo .left-ul-sear li:hover{background-color: #EFEFEF;}
                        #selinfo .left-ul-sear li{margin: 5px 0px;}
                        .left-ul-sear input:focus{
                            background-color: #36648a;
                            color: #ffffff;
                        }
                        #sear-right-tui .sear-right-tui-zi{
                            font: 12px/14px arial,helvetica,sans-serif;padding-bottom: 5px;border-bottom: 1px solid #ccc;min-height: 60px;display: flex;padding: 5px;
                        }
                        #sear-right-tui .sear-right-tui-zi .sear-right-tui-zi-img{
                            width:70px;align-self:center
                        }
                        #sear-right-tui .sear-right-tui-zi .sear-right-tui-zi-img img{
                            width:100%;
                        }
                        #sear-right-tui .sear-right-tui-zi .sear-right-tui-zi-content{
                            width: calc(100% - 70px);align-self:center;padding-left:10px
                        }
                    </style>
                    <div class="layui-form" id="searchform">
                        <div class="layui-input-block layui-col-sm12" style="position:relative;" >
                            <input onkeyup="searselnew()" type="text" id='sear' placeholder="Enter the content to search" autocomplete="off" class="layui-input input" />
                            <i class="layui-icon layui-icon-search" id='layui-icon-search' onclick='sear1()'></i>
                            <i onclick="closearnew()" class="layui-icon layui-icon-close" id='layui-icon-close' style="display:none"></i>
                            <div class="sear-tips-result" style="min-height: 100px;padding: 0px;display: none;" id='selinfo'>
                                <div style="display: flex">
                                    <div style="width: 40%;border-right: 1px solid #ccc;padding: 10px;">
                                        <h3 style="font: 12px/14px arial,helvetica,sans-serif;color: #72777d;">Suggestions</h3>
                                        <hr>
                                        <ul class='left-ul-sear' id='left-ul-sear'>

                                        </ul>
                                    </div>
                                    <div style="width: 60%;">


                                        <div id='sear-right-tui'>

                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <ul id="main-menu" class="sm sm-mint" style="float:right;position:relative;width:60%;">
                        {foreach $base_data['nav_class'] as $key=>$vo } 
                        <li>
                            <?php if($vo['first']['route_id']==0){?>
                            <a href="javascript:void(0);">{$vo['first']['cname']}</a>
                            <?php }else{ ?>
                            <a href="/{$vo['first']['url']}/">{$vo['first']['cname']}</a>
                            <?php } ?>
                            <?php if(!empty($vo['second'])){?>
                            <ul style="border-radius:0px 5px 5px 5px;">
                                {foreach $vo['second'] as $k=>$v }
                                <li class='menua'><a href="/{$v['url']}/">{$v['cname']}</a></li>
                                {/foreach}
                                <!-- <div>
                                    <ul>
                                        <li>2323</li>
                                    </ul>
                                </div> -->
                            </ul>
                            <?php } ?>
                        </li>
                        <!-- <li class="Products-nav">
                            <a href="/products/">Products</a>
                            <ul style="border-radius:0px 5px 5px 5px;">
                                <li style="background-color:#F6F6F6;padding: 10px 20px;font-weight:bold;">Bearings & Components</li>
                                <li class='menua'><a href="/ball-bearing/">Ball Bearings</a></li>
                                <li class='menua'><a href="/slewing-ring-bearings/">Slewing Ring Bearings</a></li>
                                <li class='menua'><a href="/roller-bearings/">Roller Bearings</a></li>
                                <li class='menua'><a href="/cam-followers/">Cam Followers</a></li>
                                <li class='menua'><a href="/plain-bearings/">Plain Bearings</a></li>
                                <li class='menua'><a href="/custom-bearings/">Custom Bearings</a></li>
                                <li style="background-color:#F6F6F6;padding: 10px 20px;font-weight:bold;">Special Material</li>
                                <li class='menua'><a href="/stainless-steel-bearings/">Stainless Steel Bearings</a></li>
                                <li class='menua'><a href="/ceramic-bearing/">Ceramic Bearings</a></li>
                                <li style="background-color:#F6F6F6;padding: 10px 20px;font-weight:bold;">Other</li>
                                <li class='menua'><a href="/gears/">Gears</a></li>
                                <li class='menua'><a href="/o-rings/">O-Rings</a></li>
                            </ul>
                        </li> -->
                        {/foreach}
                        <!-- <li>
                            <a href="javascript:void(0);">About Us</a>
                            <ul style="border-radius:0px 5px 5px 5px;">
                                <li class='menua'><a href="/about-us/">About Lily-Bearings</a></li>
                                <li class='menua'><a href="/about-us/why-lily/">Why Lily-Bearings</a></li>
                                <li class='menua'><a href="/about-us/distributor/">Become a Distributor</a></li>
                                <li class='menua'><a href="/about-us/affiliations/">Affiliations &#038; Associations</a></li>
                                <li class='menua'><a href="/about-us/public-benefit/">Public Benefit Activities</a></li>
                                <li class='menua'><a href="/about-us/careers/">Careers</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="javascript:void(0);">Resources</a>
                            <ul style="border-radius:0px 5px 5px 5px;">
                                <li class='menua'><a href="/application-solutions/">Industries And Applications</a></li>
                                <li class='menua'><a href="/services/">Services</a></li>
                                <li class='menua'><a href="/technology/">Technical Data Information</a></li>
                                <li class='menua'><a href="/bearing-cross-reference/">Bearing Cross Reference</a></li>
                                <li class='menua'><a href="/bearing-faqs/">Bearing FAQs</a></li>
                                <li class='menua'><a href="/blog/">Blog</a></li>
                                <li class='menua'><a href="/news-and-events/">News & Events</a></li>
                                <li class='menua'><a href="/videos/">Videos</a></li>
                                <li class='menua'><a href="/downloads/">Catalogs and Brochures</a></li>
                            </ul>
                        </li>
                       
                        <li><a href="/contact-us/">Contact Us</a></li> -->

                        
                        <li style="float: left;height: 30px;line-height:30px;" id='order_num_change_img'>
                            <a href="/order/" style="padding:0px;margin-top:3px"> <div id='order_num_change' style="color:#ffffff;float:left;margin-top:8px;margin-right: -10px;"><?php echo count(cookie('name'))?count(cookie('name')):0; ?></div><img style="aspect-ratio:2/1; object-fit:contain; width:45px;" src="{:Config::get('app.images_host')}/images/web/gouwu.png" alt="shopping cart"></a>
                        </li>
                       
                        
                        <li style="text-align:right;z-index:1">
                            <a href="/request-a-quote/" style="padding:0px;margin-top: -4px;">
                                <button class="layui-btn layui-btn-sm" style="background-color: #f7c542;color:black;font-weight:bold;border-radius:5px;height:45px;width: 180px;font-size: 15px;margin-left: 12px;">{:lang('SEND INQUIRY')}</button>
                            </a>
                        </li>
                    </ul>
                    
                    <div class="wrapper-ordernotiflines" style="display: none;"></div>
                    <div class="clear"></div>
                </div>
            </div>
            <!-- WHD -->

            <div class="navigation-header-list">
                <a href="/products/">Products</a>
                <a href="/about-us/">About Us</a>
                <a href="/contact-us/">Contact Us</a>
            </div>
        </div>
        <?php if(!isMobile()){ ?>
        <div class='qlang' id='#qlang'>
            <div class='qlang-body'>
                <div onclick='lan_qihuan2()' class="qlang-first">
                    <span>EN</span>
                    <img src="{:Config::get('app.images_host')}/images/web/down3jiao.png" alt="down3jiao" style="aspect-ratio:4/3; object-fit:contain; " />
                    <div class='clear'></div>
                </div>
                <ul class="qlang-sechond" id='qlang-sechond'>
                    <li class='qlang-sechond-l1' id='qlang-sechond-l1'><a href="https://www.lily-bearing.com/"><i class="layui-icon layui-icon-ok" style='font-size:12px;'></i>EN</a></li>
                    <li class="qlang-sechond-l2" onMouseOut="qlang_hover_out()" onmouseover="qlang_hover()"><a href="https://www.lilybearing.com/"><i class="layui-icon layui-icon-ok" style='font-size:12px'></i>CN</a></li>
                </ul>
            </div>
        </div>
       <?php } ?>
        <div class="clear"></div>

    </div>

</nav>


<!--end 导航-->


